<template>
  <el-table :data="pageTableData(tableData)"
            height="78vh"
            style="width: 100%;"
            :header-cell-style="{ 'text-align': 'center' }"
            :cell-style="{ textAlign: 'center' }"
  >
    <el-table-column label="商品名/条码" width="250">
      <template #default="scope">
        <el-row>
          <el-col span="24" style="padding-left: 5%;">
            <el-row><el-text>{{ scope.row.goodsName }}</el-text></el-row>
            <el-row><el-text>{{ scope.row.code }}</el-text></el-row>
          </el-col>
        </el-row>
      </template>
    </el-table-column>
    <el-table-column prop="price" label="本店价格" />
    <el-table-column label="定价分布">
      <template #default="scope">
        <el-text>低于{{scope.row.pricingRatio * 100}}%的其他门店</el-text>
      </template>
    </el-table-column>
    <el-table-column label="建议调价">
      <template #default="scope">
        <div><el-text type="warning" size="large">涨{{ scope.row.adjustSuggest }}</el-text></div>
        <div><el-text>预计月毛利涨{{ scope.row.grossGrowth }}</el-text></div>
      </template>
    </el-table-column>
    <el-table-column label="操作">
      <template #default="scope">
        <el-button type="warning" round @click="showUpdate(scope.row)">改价</el-button>
      </template>
    </el-table-column>
  </el-table>
  <div style="justify-content: center;align-items:center;height: 60px; background-color: rgba(255,255,255,0.72);boxShadow:1px 0px 1px #a6a6a6;z-index: 999;display: flex;padding: 5px 25px 5px 25px;">
    <div style="flex: 4;" >
      <el-pagination
          v-model:current-page="currentPage"
          v-model:page-size="pageSize"
          :background="true"
          layout="->,prev, pager, next, jumper"
          :total="tableData.length"
          @current-change="handleCurrentChange"
      />
    </div>
  </div>
  <el-dialog v-model="isUpdate" title="更改价格" width="20%" center>
    <el-form>
      <el-form-item label="价格" label-width="100px" >
        <el-row justify="space-evenly" style="justify-content: center;align-items:center;">
          <el-col :span="12">
            <el-input v-model="goodsInfoTemp.price" min="0" type="number" style="max-width: 90px" />
          </el-col>
          <el-col :span="12">
            <el-button style="margin-left: 5%" type="primary" plain @click="getSuggestedPrice">建议价</el-button>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15%">
          <el-button  style="margin-left: 5%;" @click="updatePrice">更改</el-button>
        </el-row>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script setup>

import {onMounted, ref} from "vue";
import request from "@/utils/request";
import {store} from "@/store";
import {ElMessage} from "element-plus";

const tableData=ref([])
const currentPage = ref(1)
const pageSize = ref(30)
let isUpdate=ref(false)
const goodsInfoTemp=ref({})
onMounted(()=>{
  request.get("/business/get/BusinessPriceAdjustSuggest/"+store.getLocalCurrentStoreMain().storeId).then(res=>{
    tableData.value=res.data
  })
})
const handleCurrentChange = (e) => {
  currentPage.value = e;
};
const pageTableData = (list) => {
  return list.filter(
      (item, index) =>
          index < currentPage.value * pageSize.value &&
          index >= pageSize.value * (currentPage.value - 1)
  );
};
const showUpdate = (data) =>{
  goodsInfoTemp.value=data
  isUpdate.value=true
}
const updatePrice = () => {
  request.post("/goods/update/goodsStore",[goodsInfoTemp.value]).then(res=>{
    request.get("/business/get/BusinessPriceAdjustSuggest/"+store.getLocalCurrentStoreMain().storeId).then(res=>{
      tableData.value=res.data
    })
    request.get("/goods/get/goodsCodeList/"+store.getLocalCurrentStoreMain().storeId).then(res1=>{
      for (let i in res1.data){
        localStorage.removeItem(res1.data[i])
      }
      request.get("/goods/get/goodsInfo/"+store.getLocalCurrentStoreMain().storeId).then(res2=>{
        for (let i in res2.data){
          store.setLocalStorage(res2.data[i].code,res2.data[i])
        }
        store.resetStoreGoodsInfo()
        console.log("resetLocalGoodsInfo done")
        store.goodsStoreInfoList=[]
        for (let i in res1.data){
          store.goodsStoreInfoList.push(store.getLocalStorage(res1.data[i]))
        }
      })
    })
    isUpdate.value=false
    ElMessage({
      message: '已更改价格',
      type: 'success',
    })
  })
}
const getSuggestedPrice = () => {
  request.get("/goods/get/suggestedPrice/"+goodsInfoTemp.value.code).then(res=>{
    if (res.data!==null)
      goodsInfoTemp.value.price=res.data
    else
      ElMessage({
        message: "没有此商品的建议价",
        type: 'warning',
      })
  })
}
</script>

<style scoped>

</style>